<%--
  Created by IntelliJ IDEA.
  User: haojianlei
  Date: 2018-11-23
  Time: 13:45
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>计划详情</title>
    <meta name="keywords" content="">
    <meta name="description" content="">

    <link rel="shortcut icon" href="favicon.ico">
    <link href="${pageContext.request.contextPath}/assets/shipui/css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
    <link href="${pageContext.request.contextPath}/assets/shipui/css/font-awesome.min.css?v=4.4.0" rel="stylesheet">
    <link href="${pageContext.request.contextPath}/assets/shipui/css/animate.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath}/assets/shipui/css/style.css?v=4.1.0" rel="stylesheet">
    <link href="${pageContext.request.contextPath}/assets/shipui/css/plugins/sweetalert/sweetalert.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath}/assets/layui/css/layui.css" rel="stylesheet">

</head>

<body class="gray-bg">
<input style="display: none" id="planId" value="${planId}"/>
<div class="row wrapper border-bottom white-bg page-heading">
    <div class="col-sm-4" style="margin-top: 20px">
        <ol class="breadcrumb">
            <li>
                <a href="toTransportHome.do">运输计划</a>
            </li>
            <li>
                <strong>计划详情</strong>
            </li>
        </ol>
    </div>
    <div class="col-sm-8">

    </div>

    <div class="row" style="padding: 15px;margin-right: 15px;margin-top:70px">
        <div class="col-xs-8 col-sm-8">
            计划编号：
            <span id="planNameSpan" style="font-family: Impact"></span></div>
        <button class="col-sm-2 btn btn-primary" style="margin-right: 15px" data-toggle="modal" data-target="#editPlan"
                onclick="showEditPlanData()">编辑计划
        </button>
        <button class="col-xs-2 col-sm-1 btn btn-danger btn-outline" onclick="deletePlan()" id="zhHfPlan">中止计划</button>
    </div>

    <%--编辑计划模态框--%>
    <div class="modal fade" id="editPlan" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog" style="width:50%;">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                        &times;
                    </button>
                    <h3 class="modal-title">
                        编辑计划
                    </h3>
                </div>
                <div class="modal-body">
                    <div class="form-horizontal m-t">
                    <div class="form-group">
                        <label class="col-sm-3 control-label">计划编号：</label>
                        <div class="col-sm-8">
                            <input id="planIdEdit" style="display: none" type="text">
                            <input id="tmsNumberEdit" name="tmsNumber" class="form-control" type="text"
                                   placeholder="必填">
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="row">
                            <label class="col-sm-3 control-label" style="margin-left: 7px">选择货种：</label>
                            <div class="col-sm-4" style="font-size: 14px;margin-top: 5px">
                                <select class="form-control" id="editHuoZhong">
                                </select>
                            </div>
                            <div class="col-sm-3">
                                <button class="btn btn-default" type="submit" style="margin-top: 5px">+添加货种</button>
                            </div>
                        </div>

                    </div>
                    <div class="form-group">
                        <div class="row">
                            <label class="col-sm-3 control-label" style="margin-left: 7px">装货港口：</label>
                            <div class="col-sm-4" style="font-size: 14px;margin-top: 5px">
                                <select class="form-control" id="editOriginalPort">
                                </select>
                            </div>
                            <div class="col-sm-3">
                                <button class="btn btn-default" type="submit" style="margin-top: 5px">+添加港口</button>
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="row">
                            <label class="col-sm-3 control-label" style="margin-left: 7px">卸货港口：</label>
                            <div class="col-sm-4" style="font-size: 14px;margin-top: 5px">
                                <select class="form-control" id="editDestinationPort">
                                </select>
                            </div>
                            <div class="col-sm-3">
                                <button class="btn btn-default" type="submit" style="margin-top: 5px">+添加港口</button>
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-3 control-label">计划吨位：</label>
                        <div class="col-sm-8">
                            <input id="planTonEdit" name="password" class="form-control" type="text">
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="row">
                            <label class="col-sm-3 control-label" style="margin-left: 7px">选择货主：</label>
                            <div class="col-sm-4" style="font-size: 14px;margin-top: 5px">
                                <select class="form-control" id="editHuoZhu">
                                </select>
                            </div>
                            <div class="col-sm-3">
                                <button class="btn btn-default" type="submit" style="margin-top: 5px">+添加货主</button>
                            </div>
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-sm-3 control-label">计划负责人：</label>
                        <div class="col-sm-8">
                            <input id="planEmployEdit" name="planEmploy" class="form-control" type="text">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-3 control-label">计划开始时间：</label>
                        <div class="col-sm-8">
                            <input id="startTimeEdit" name="startTime" class="form-control" type="text">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-3 control-label">计划结束时间：</label>
                        <div class="col-sm-8">
                            <input id="endTimeEdit" name="endTime" class="form-control" type="text">
                        </div>
                    </div>

                    <div class="form-group">
                        <div class="col-sm-8 col-sm-offset-3">
                            <button class="btn btn-primary" type="submit" onclick="editPlanModel()">编辑完成</button>
                        </div>
                    </div>
                </div>
                </div>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->

    <div class="row" style="padding: 5px;margin-right: 15px;margin-left: -5px">
        <div class="col-xs-4 col-sm-4">负责人：<span id="planHeadSpan"/></div>
        <div class="col-xs-4 col-sm-4">货种：<span id="goodsNameSpan"/></div>
        <div class="col-xs-4 col-sm-4">货主：<span id="huoZhuSpan"/></div>
    </div>

    <div class="row" style="padding: 5px;margin-right: 15px;margin-left: -5px">
        <div class="col-xs-4 col-sm-4">创建时间：<span id="createTimeSpan"/></div>
        <div class="col-xs-4 col-sm-4">运单区间：<span id="originalNameSpan"></span> 到 <span id="destinationNameSpan"></span></div>
        <div class="col-xs-4 col-sm-4">联系人：<span id="contactManSpan"></span>（<span id="contactPhoneSpan"></span>）</div>
    </div>
</div>

<div class="wrapper wrapper-content">

    <%--运单状态--%>
    <div class="row">
        <div class="col-sm-12">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <h5>运单状态</h5>
                </div>
                <div class="ibox-content text-center">
                    <div class="progress progress-striped active">
                        <div id="stateProgress" style="width: 0%" aria-valuemax="100" aria-valuemin="0"
                             aria-valuenow="75" role="progressbar" class="progress-bar progress-bar-success">
                            <span class="sr-only">40% Complete (success)</span>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-xs-2 col-sm-2 text-center">未开始</div>
                        <div class="col-xs-3 col-sm-3 text-center"></div>
                        <div class="col-xs-2 col-sm-2 text-center">运输中</div>
                        <div class="col-xs-3 col-sm-3 text-center"></div>
                        <div class="col-xs-2 col-sm-2 text-center">已完成</div>
                    </div>
                    <div class="row" style="color: #E3E3E3;font-size: 18px;font-weight: 800">
                        <div class="col-xs-2 col-sm-2 text-center">0%</div>
                        <div class="col-xs-3 col-sm-3 text-center"></div>
                        <div class="col-xs-2 col-sm-2 text-center">50%</div>
                        <div class="col-xs-3 col-sm-3 text-center"></div>
                        <div class="col-xs-2 col-sm-2 text-center">100%</div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <%--运输实效--%>
    <div class="row">
        <div class="col-sm-12">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <h5>运输时效</h5>
                    <div class="ibox-tools">
                        <span>货损率 <span id="goodsSLSpan"></span></span>
                        <span style="margin-left: 10px">计划执行效率 <span id="executeEfficiencySpan"></span></span>
                    </div>
                </div>
                <div class="ibox-content">
                    <div class="row">
                        <div class="col-xs-4 col-sm-4">计划执行状态：<span id="transportStateName"></span></div>
                        <div style="display: none">计划执行状态：<span id="transportStateSpan"></span></div>
                        <div class="col-xs-4 col-sm-4">运输总计用时：<span id="totalTimeSpan"></span></div>
                        <div class="col-xs-4 col-sm-4">装货平均时长：<span id="zAvgSpan"></span></div>
                    </div>
                    <div class="row" style="margin-top: 15px">
                        <div class="col-xs-4 col-sm-4">计划开始时间：<span id="planStartDateSpan"></span></div>
                        <div class="col-xs-4 col-sm-4">计划完成时间：<span id="planEndDateSpan"></span></div>
                        <div class="col-xs-4 col-sm-4">卸货平均时长：<span id="xAvgSpan"></span></div>
                    </div>
                    <div class="row" style="margin-top: 15px">
                        <div class="col-xs-4 col-sm-4">实际开始时间：<span id="realStartTimeSpan"></span></div>
                        <div class="col-xs-4 col-sm-4">实际完成时间：<span id="realEndDateSpan"></span></div>
                        <div class="col-xs-4 col-sm-4">在航平均时长：<span id="zhAvgSpan"></span></div>
                    </div>
                    <div class="row" style="margin-top: 15px">
                        <div class="col-xs-4 col-sm-4">计划吨位：<span id="planTonnageSpan"></span>吨</div>
                        <div class="col-xs-4 col-sm-4">实装吨位：<span id="szTonnageSpan"></span>吨</div>
                        <div class="col-xs-4 col-sm-4">实收吨位：<span id="ssTonnageSpan"></span>吨</div>
                    </div>

                </div>
            </div>
        </div>
    </div>

    <%--承运船舶--%>
    <div class="row">
        <div class="col-sm-12">
            <div class="ibox">
                <div class="ibox-title">
                    <h5>承运船舶</h5>
                    <div class="ibox-tools">
                        <span class="btn btn-primary btn-xs" style="height: 23px" data-toggle="modal"
                              data-target="#shipMapDetail" onclick="AllFleetPosition()">全部船队位置</span>
                    </div>
                </div>
                <div class="ibox-content">
                    <div class="row m-b-sm m-t-sm">
                        <div class="col-md-12">
                            <button type="button" class="btn btn-sm btn-default col-md-12" data-toggle="modal"
                                    data-target="#planAddShip" onclick="searchShips(1)" id="addShipsBtn">添加承运船舶
                            </button>
                        </div>
                    </div>

                    <div class="project-list">
                        <table class="table table-hover">
                            <tbody id="theShipList">
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>


<%--船队位置模态框--%>
<div class="modal fade" id="shipMapDetail" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
     aria-hidden="true">
    <div class="modal-dialog" style="width:80%;">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                    &times;
                </button>
                <h3 class="modal-title">
                    全部船队位置
                </h3>
            </div>
            <div class="modal-body" id="allAMap" style="width: 100%;margin: 0 auto;height: 550px">
            </div>
        </div>
    </div>
</div>
<!-- end -->


<%--编辑运单时间模态框--%>
<div class="modal fade" id="planTimeDetail" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
     aria-hidden="true">
    <div class="modal-dialog" style="width:90%;">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                    &times;
                </button>
                <h3 class="modal-title">
                    编辑运单时间
                </h3>
            </div>
            <div class="modal-body">
                <form class="form-horizontal m-t" id="planTimeEdit">
                    <input id="shipIdInput" style="display: none" type="text">
                    <input id="sailingScheduleIdInput" style="display: none" type="text">
                    <div class="row">
                        <div class="col-sm-6">
                            <div class="form-group">
                                <label class="col-sm-3 control-label">抵达装货地时间：</label>
                                <div class="col-sm-8">
                                    <input id="arrivedOriginalTimeInput" name="endTime" class="form-control"
                                           type="text">
                                </div>
                            </div>
                        </div>
                        <div class="col-sm-6">
                            <div class="form-group">
                                <label class="col-sm-3 control-label">开始装货时间：</label>
                                <div class="col-sm-8">
                                    <input id="startLoadTimeInput" name="endTime" class="form-control" type="text">
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-sm-6">
                            <div class="form-group">
                                <label class="col-sm-3 control-label">已装完时间：</label>
                                <div class="col-sm-8">
                                    <input id="endLoadTimeInput" name="endTime" class="form-control" type="text">
                                </div>
                            </div>
                        </div>
                        <div class="col-sm-6">
                            <div class="form-group">
                                <label class="col-sm-3 control-label">实载吨位(吨)：</label>
                                <div class="col-sm-8">
                                    <input id="szTonnageInput" name="endTime" class="form-control" type="number">
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-sm-6">
                            <div class="form-group">
                                <label class="col-sm-3 control-label">抵达卸货地时间：</label>
                                <div class="col-sm-8">
                                    <input id="arrivedDestinationTimeInput" name="endTime" class="form-control"
                                           type="text">
                                </div>
                            </div>
                        </div>
                        <div class="col-sm-6">
                            <div class="form-group">
                                <label class="col-sm-3 control-label">开始卸货时间：</label>
                                <div class="col-sm-8">
                                    <input id="startUploadTimeInput" name="endTime" class="form-control" type="text">
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-sm-6">
                            <div class="form-group">
                                <label class="col-sm-3 control-label">已卸完时间：</label>
                                <div class="col-sm-8">
                                    <input id="endUploadTimeInput" name="endTime" class="form-control" type="text">
                                </div>
                            </div>
                        </div>
                        <div class="col-sm-6">
                            <div class="form-group">
                                <label class="col-sm-3 control-label">实收吨位(吨)：</label>
                                <div class="col-sm-8">
                                    <input id="ssTonnageInput" name="endTime" class="form-control" type="number">
                                </div>
                            </div>
                        </div>
                    </div>


                    <div class="row">
                        <div class="col-sm-6">
                            <div class="form-group">
                                <label class="col-sm-3 control-label"></label>
                                <div class="col-sm-8">
                                    <button class="btn btn-primary pull-left" type="button" onclick="editTimeOver()">
                                        编辑完成
                                    </button>
                                </div>
                            </div>
                        </div>
                        <div class="col-sm-6">
                            <div class="form-group">
                                <label class="col-sm-3 control-label"></label>
                                <div class="col-sm-8">
                                </div>
                            </div>
                        </div>
                    </div>

                </form>
            </div>
        </div>
    </div>
</div>
<!-- end -->

<%-- 详情模态框--%>
<div class="modal fade" id="planTimeDetailXQ" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
     aria-hidden="true">
    <div class="modal-dialog" style="width:80%;">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                    &times;
                </button>
                <h3 class="modal-title">
                    运单时间
                </h3>
            </div>
            <div class="modal-body">
                <form class="form-horizontal m-t">
                    <div class="row">
                        <div class="col-sm-6">
                            <div class="form-group">
                                <label class="col-sm-3 control-label">抵达装货地时间：</label>
                                <div class="col-sm-8">
                                    <div id="arrivedOriginalTimeDiv" class="form-control"></div>
                                </div>
                            </div>
                        </div>
                        <div class="col-sm-6">
                            <div class="form-group">
                                <label class="col-sm-3 control-label">开始装货时间：</label>
                                <div class="col-sm-8">
                                    <div id="startLoadTimeDiv" class="form-control"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-sm-6">
                            <div class="form-group">
                                <label class="col-sm-3 control-label">已装完时间：</label>
                                <div class="col-sm-8">
                                    <div id="endLoadTimeDiv" class="form-control"></div>
                                </div>
                            </div>
                        </div>
                        <div class="col-sm-6">
                            <div class="form-group">
                                <label class="col-sm-3 control-label">实载吨位：</label>
                                <div class="col-sm-8">
                                    <div id="szTonnageDiv" class="form-control"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-sm-6">
                            <div class="form-group">
                                <label class="col-sm-3 control-label">抵达卸货地时间：</label>
                                <div class="col-sm-8">
                                    <div id="arrivedDestinationTimeDiv" class="form-control"></div>
                                </div>
                            </div>
                        </div>
                        <div class="col-sm-6">
                            <div class="form-group">
                                <label class="col-sm-3 control-label">开始卸货时间：</label>
                                <div class="col-sm-8">
                                    <div id="startUploadTimeDiv" class="form-control"></div>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-sm-6">
                            <div class="form-group">
                                <label class="col-sm-3 control-label">已卸完时间：</label>
                                <div class="col-sm-8">
                                    <div id="endUploadTimeDiv" class="form-control"></div>
                                </div>
                            </div>
                        </div>
                        <div class="col-sm-6">
                            <div class="form-group">
                                <label class="col-sm-3 control-label">实收吨位：</label>
                                <div class="col-sm-8">
                                    <div id="ssTonnageDiv" class="form-control"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
<!-- end -->

<%--添加承运船舶模态框--%>

<div class="modal fade" id="planAddShip" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog" style="width:90%;">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                    &times;
                </button>
                <h3 class="modal-title">
                    船舶运力信息
                </h3>
            </div>
            <div class="modal-body">
                <div class="form-group">
                    <div class="row">
                        <div class="col-md-4">
                            <input type="hidden" id="pages" value="">
                            <input type="text" id="shipNames" class="form-control" placeholder="请输入船名">
                        </div>
                        <input id = "wxBindInput" style="display: none" value="<%=request.getSession().getAttribute("SESSION_WX_BIND") %>"/>
                        <div class="col-md-2 pull-left">
                            <button class="btn btn-primary" type="button" id="searchShipsButton"
                                    onclick="searchShips($('#page1').val())">搜索船舶
                            </button>
                        </div>
                    </div>
                </div>
                <table class="layui-table">
                    <thead>
                    <tr>
                        <th>船名</th>
                        <th>吨位</th>
                        <th>实时位置</th>
                        <th>电话</th>
                        <%--<th>目的地</th>
                        <th>预计到达时间</th>--%>
                        <th>调度人</th>
                        <th>操作</th>
                    </tr>
                    </thead>
                    <tbody id="tbody"></tbody>
                </table>
                <div class="row">
                    <div class="col-md-7">
                        <div class="col-md-2">
                            <select id="limit" name="limit">
                                <option value="10">10条/页</option>
                                <option value="20">20条/页</option>
                                <option value="30">30条/页</option>
                                <option value="40">40条/页</option>
                                <option value="50">50条/页</option>
                            </select>
                        </div>
                        <span id="summary"></span>
                    </div>
                    <div class="col-md-5" style="float: right">
                        <input type="hidden" id="pagenum"/>
                        <input type="hidden" id="pagesize"/>
                        <ul id="pagination" class="pagination" style="margin:0">
                            <li id="homePage"><a href="#" class="btn btn-default" style="height: 26px">首页</a></li>
                            <li id="previousPage"><a href="#" class="btn btn-default" style="margin-left: 5px;height: 26px">上一页</a>
                            </li>
                            <li id="nextPage"><a href="#" class="btn btn-default" style="margin-left: 5px;height: 26px">下一页</a></li>
                            <li id="tailPage"><a href="#" class="btn btn-default" style="margin-left: 5px;height: 26px">最后一页</a></li>
                            <%--<li>跳转至<input id='page1' name='pages' type='text' size="6"/>页<input type='button' value='GO'--%>
                                                                                                <%--onclick='searchShips($("#page1").val())'/>--%>
                            <%--</li>--%>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div><!-- /.modal-content -->
</div><!-- /.modal -->
<%--end--%>


<!-- 全局js -->
<script src="${pageContext.request.contextPath}/assets/shipui/js/jquery.min.js?v=2.1.4"></script>
<script src="${pageContext.request.contextPath}/assets/shipui/js/bootstrap.min.js?v=3.3.6"></script>

<!-- 自定义js -->
<script src="${pageContext.request.contextPath}/assets/shipui/js/content.js?v=1.0.0"></script>
<script src="${pageContext.request.contextPath}/assets/shipui/js/plugins/sweetalert/sweetalert.min.js"></script>
<script src="${pageContext.request.contextPath}/assets/shipui/js/common.js"></script>
<script src="https://webapi.amap.com/maps?v=1.4.10&key=30556745e1796cbe4f69a621a8bc58bf&&plugin=AMap.Geocoder"></script>
<script src="${pageContext.request.contextPath}/assets/layui/layui.js" charset="utf-8"></script>

<script type="text/javascript">
    //postAjax
    function postAjax(url, data, fn) {
        $.ajax({
            url: url,
            data: data,
            type: 'post',
            contentType: "application/json",
            dataType: 'json',
            success: function (result) {
                fn(result);
            }
        });
    }

    function postAjax(url, data, fn, param) {
        $.ajax({
            url: url,
            data: data,
            type: 'post',
            contentType: "application/json",
            dataType: 'json',
            success: function (result) {
                fn(result, param);
            }
        });
    }

    function postAjax(url, data, fn, param, param1,param2) {
        $.ajax({
            url: url,
            data: data,
            type: 'post',
            contentType: "application/json",
            dataType: 'json',
            success: function (result) {
                fn(result, param, param1,param2);
            }
        });
    }

    function postAjax(url, data, fn, param, param1,param2,param3) {
        $.ajax({
            url: url,
            data: data,
            type: 'post',
            contentType: "application/json",
            dataType: 'json',
            success: function (result) {
                fn(result, param, param1,param2,param3);
            }
        });
    }
</script>

<script type="text/javascript">
    var planDetailInfo = '';
    $(function () {
        getPlanDetail($("#planId").val())
    });

    function getPlanDetail(planId) {
        var data = JSON.stringify({planId: planId});
        postAjax("transportPlan/queryTransportPlanDetails.do", data, setPlanDetailInfo);
    }

    var dispatcher;
    function addShipToPlan(shipId, flag) {

        //是否绑定微信
        var wxBind = $("#wxBindInput").val();
            if (wxBind == "N") {
                swal({
                    title: "您还没有绑定微信！",
                    text: "请先去绑定微信并关注微信公众号才能使用此功能",
                    type: "warning",
                    confirmButtonColor: "#DD6B55",
                    confirmButtonText: "确定"
                }, function () {
                    window.location.href="toPersonalInfo.do";
                });
                return false;
            }

        dispatcher = "#id_" + shipId;

        if (!$(dispatcher).val()) {
            swal({
                title: "请输入调度员名称",
                type: "warning"
            });
            return false;
        }
        else {
            var shipList = [{shipId: shipId}];
            if ("N" == flag) {
                var data = JSON.stringify({
                    planId: $("#planId").val(),
                    push: 'N',
                    dispatcher: $(dispatcher).val(),
                    shipList: shipList
                });
                postAjax("transportPlan/addTransportPlanShip.do", data, fnAlertAddShipToPlan);
            }
            else {
                var data = JSON.stringify({consumeTypeId: 4, shipList: shipList});
                postAjax("deductions/generatingOrder.do", data, fnAlertGeneratingOrder, shipList);
            }
        }
    }
        function fnAlertGeneratingOrder(result, shipList) {
        if (result.SUCCESS) {
            swal({
                title: "扣费金额提醒",
                text:"开启本功能将会收取"+result.totalMoney+"代币,您目前剩余"+result.leftAmount+"代币",
                type: "success"
            }, function () {
                var data = JSON.stringify({
                    planId: $("#planId").val(),
                    push: 'Y',
                    dispatcher: $(dispatcher).val(),
                    shipList: shipList,
                    consumeId: result.consumeId
            });
                postAjax("transportPlan/addTransportPlanShip.do", data, fnAlertAddShipToPlan);
            });
        }
        else {
            swal({
                title:  result.MSG,
                text: "点击确定去充值~",
                type: "warning",
                showCancelButton: true,
                confirmButtonColor: "#DD6B55",
                confirmButtonText: "确定",
                closeOnConfirm: false
            }, function () {
                window.location.href="toRecharge.do";
            });
        }
    }

    function fnAlertAddShipToPlan(result) {
        if (result.SUCCESS) {
            swal({
                title: "添加船舶到计划成功",
                type: "success"
            }, function () {
                searchShips(1);
                var data = JSON.stringify({planId: $("#planId").val(), state: 0});
                postAjax("transportPlan/queryPlanShip.do", data, showTheShipList);
            });
        }
        else {
            swal({
                title: "添加船舶到计划失败",
                type: "warning"
            });
        }
    }

    function setPlanDetailInfo(result) {
        planDetailInfo = result;
        var data = result.data;
        $("#planNameSpan").text(data.planName);
        $("#planHeadSpan").text(data.planHead);
        $("#goodsNameSpan").text(data.goodsName);
        $("#huoZhuSpan").text(data.huoZhuName);
        $("#createTimeSpan").text(data.createTime);
        $("#originalNameSpan").text(data.originalName);
        $("#destinationNameSpan").text(data.destinationName);
        $("#contactManSpan").text(data.contactMan);
        $("#contactPhoneSpan").text(data.contactPhone);
        var width = 0;
        $("#zhHfPlan").text("中止计划");
        $("#addShipsBtn").attr("style","display:block");
        if (1 == data.transportState) {
            width = 50;
        }
        else if (2 == data.transportState) {
            width = 100;
            $("#addShipsBtn").attr("style","display:none");
        }
        else if (4 == data.transportState) {
            $("#zhHfPlan").text("恢复计划");
        }
        $("#stateProgress").attr("style", "width:" + width + "%");
        $("#goodsSLSpan").text(data.goodsSL);
        $("#executeEfficiencySpan").text(data.executeEfficiency);
        $("#transportStateName").text(data.transportStateName);
        $("#transportStateSpan").text(data.transportState);
        $("#planEndDateSpan").text(data.planEndDate);
        $("#zAvgSpan").text(data.zAvg);

        $("#planStartDateSpan").text(data.planStartDate);
        $("#realEndDateSpan").text(data.realEndDate);
        $("#xAvgSpan").text(data.xAvg);

        $("#realStartTimeSpan").text(data.realStartTime);
        $("#totalTimeSpan").text(data.totalTime);
        $("#zhAvgSpan").text(data.zhAvg);

        $("#planTonnageSpan").text(data.planTonnage);
        $("#totalTimeSpan").text(data.totalTime);
        $("#zhAvgSpan").text(data.zhAvg);

        $("#planTonnageSpan").text(data.planTonnage);
        $("#szTonnageSpan").text(data.szTonnage);
        $("#ssTonnageSpan").text(data.ssTonnage);

        var data = JSON.stringify({planId: data.planId, state: 0});
        postAjax("transportPlan/queryPlanShip.do", data, showTheShipList);
    }

    function showTheShipList(result) {
        var content = '';
        var data = result.data;
        for (var i = 0; i < data.length; i++) {
            var item = data[i];
            var detailData = item.data;
            var transportXL = "0%";
            if (detailData.szTonnage && detailData.ssTonnage) {
                transportXL = (detailData.ssTonnage) / detailData.szTonnage * 100 + "%";
            }
            if ("2" == $("#transportStateSpan").text()) {
                content += "<tr><td class='project-status'>" + item.processName + "<span class='label label-primary'></span></td><td class='project-title'>" + detailData.shipName + "<br/><small>电话:" + detailData.phoneNum + "</small></td><td class='project-title'><span>当前位置</span><br/><small>"+ detailData.cityName + "</small></td><td class='project-title'>" + item.lastLabel + "<span style='color: #0d8ddb;cursor: pointer' data-toggle='modal'  data-target='#planTimeDetailXQ'  onclick='showSailingData(" + detailData.sailingScheduleId + ",1)'>详情></span><br/><small>" + item.lastUpdate + "</small></td><td class='project-title'>调度员<br/><small>" + detailData.dispatcher + "</small></td><td class='project-completion'><small>当前进度： " + item.process + "</small><div class='progress progress-mini'><div style='width:" + item.process + "' class='progress-bar'></div></div></td><td class='project-title'>运输效率<br/><small>" + transportXL + "</small></td><td class='project-actions'></td></tr>"
            }
            else {
                content += "<tr><td class='project-status'>" + item.processName + "<span class='label label-primary'></span></td><td class='project-title'>" + detailData.shipName + "<br/><small>电话:" + detailData.phoneNum + "</small></td><td class='project-title'><span>当前位置</span><br/><small>"+ detailData.cityName + "</small></td><td class='project-title'>" + item.lastLabel + "<span style='color: #0d8ddb;cursor: pointer' data-toggle='modal'  data-target='#planTimeDetailXQ'  onclick='showSailingData(" + detailData.sailingScheduleId + ",1)'>详情></span><br/><small>" + item.lastUpdate + "</small></td><td class='project-title'>调度员<br/><small>" + detailData.dispatcher + "</small></td><td class='project-completion'><small>当前进度： " + item.process + "</small><div class='progress progress-mini'><div style='width:" + item.process + "' class='progress-bar'></div></div></td><td class='project-title'>运输效率<br/><small>" + transportXL + "</small></td><td class='project-actions'><span style='color: #0d8ddb;cursor: pointer' data-toggle='modal' data-target='#planTimeDetail' onclick='setEditSailingData(" + detailData.sailingScheduleId + ")'>编辑 </span><span style='color: #0d8ddb;cursor: pointer' data-toggle='modal' onclick='removePlanShip(" + detailData.shipId + "," + +detailData.sailingScheduleId + ")'>移除船舶</span></td></tr>"
            }
        }
        $("#theShipList").html(content);
    }


    function setEditSailingData(sailingScheduleId) {
        showSailingData(sailingScheduleId, 2);
    }

    var laydate;
    layui.use('laydate', function () {
        laydate = layui.laydate;
    });

    var xqFlag;

    function showSailingData(sailingScheduleId, flag) {
        xqFlag = flag;
        var data = JSON.stringify({sailingScheduleId: sailingScheduleId});
        postAjax("transportPlan/queryPlanShipShipSchedule.do", data, setSailingDataInfo);
    }

    function setSailingDataInfo(result) {
        var data = result.data;
        if (1 == xqFlag) {
            $("#arrivedOriginalTimeDiv").text(data.arrivedOriginalTime);
            $("#startLoadTimeDiv").text(data.startLoadTime);
            $("#endLoadTimeDiv").text(data.endLoadTime);
            $("#szTonnageDiv").text(data.szTonnage);
            $("#arrivedDestinationTimeDiv").text(data.arrivedDestinationTime);
            $("#startUploadTimeDiv").text(data.startUploadTime);
            $("#endUploadTimeDiv").text(data.endUploadTime);
            $("#ssTonnageDiv").text(data.ssTonnage);
        }
        else {
            $("#shipIdInput").val(data.shipId);
            $("#sailingScheduleIdInput").val(data.sailingScheduleId);
            laydate.render({
                elem: '#arrivedOriginalTimeInput'
                , type: 'datetime'
                , value: data.arrivedOriginalTime
            });
            laydate.render({
                elem: '#startLoadTimeInput'
                , type: 'datetime'
                , value: data.startLoadTime
            });
            laydate.render({
                elem: '#endLoadTimeInput'
                , type: 'datetime'
                , value: data.endLoadTime
            });
            $("#szTonnageInput").val(data.szTonnage);
            laydate.render({
                elem: '#arrivedDestinationTimeInput'
                , type: 'datetime'
                , value: data.arrivedDestinationTime
            });
            laydate.render({
                elem: '#startUploadTimeInput'
                , type: 'datetime'
                , value: data.startUploadTime
            });
            laydate.render({
                elem: '#endUploadTimeInput'
                , type: 'datetime'
                , value: data.endUploadTime
            });
            $("#ssTonnageInput").val(data.ssTonnage);
        }

    }

    function removePlanShip(shipId, sailingScheduleId) {

        swal({
            title: "确定移除该船舶吗？",
            text: "移除后需要重新添加！",
            type: "warning",
            showCancelButton: true,
            confirmButtonColor: "#DD6B55",
            confirmButtonText: "移除",
            closeOnConfirm: false
        }, function () {
            var data = JSON.stringify({planId: $("#planId").val(), shipId: shipId, sailingScheduleId: sailingScheduleId});
            postAjax('transportPlan/deleteTransportPlanShip.do', data, fnAlertRemovePlanShip);
        });
    }


    function editTimeOver() {
        var shipId = $("#shipIdInput").val();
        var sailingScheduleId = $("#sailingScheduleIdInput").val();
        var arrivedOriginalTimeInput = $("#arrivedOriginalTimeInput").val();
        var startLoadTimeInput = $("#startLoadTimeInput").val();
        var endLoadTimeInput = $("#endLoadTimeInput").val();
        var szTonnageInput = $("#szTonnageInput").val();
        var arrivedDestinationTimeInput = $("#arrivedDestinationTimeInput").val();
        var startUploadTimeInput = $("#startUploadTimeInput").val();
        var endUploadTimeInput = $("#endUploadTimeInput").val();
        var ssTonnageInput = $("#ssTonnageInput").val();
        var data = JSON.stringify({
            planId: $("#planId").val(),
            shipId: shipId,
            sailingScheduleId: sailingScheduleId,
            arrivedOriginalTime: arrivedOriginalTimeInput,
            startLoadTime: startLoadTimeInput,
            endLoadTime: endLoadTimeInput,
            szTonnage: szTonnageInput,
            ssTonnage: ssTonnageInput,
            arrivedDestinationTime: arrivedDestinationTimeInput,
            startUploadTime: startUploadTimeInput,
            endUploadTime: endUploadTimeInput
        });
        postAjax("transportPlan/editSchedule.do", data, fnAlertEditTimeOver);
    }

    //显示修改运输计划模态框
    function showEditPlanData() {
        var data = JSON.stringify({});
        var resultJson = planDetailInfo.data;
        $("#planIdEdit").val(resultJson.planId);
        $("#tmsNumberEdit").val(resultJson.planName);
        postAjax('config/queryGoodsConfig.do', data, huoZhongSelect, $("#editHuoZhong"),resultJson.goodsId);
        postAjax('config/queryLogisticsConfig.do', data, setPortSelect, $("#editOriginalPort"), $("#editDestinationPort"),resultJson.originalId,resultJson.destinationId);
        postAjax('config/queryHuoZhuConfig.do', data, setHuoZhuSelect, $("#editHuoZhu"),resultJson.huoZhuId);
        $("#planTonEdit").val(resultJson.planTonnage);
        $("#planEmployEdit").val(resultJson.planHead);
        $("#startTimeEdit").val(resultJson.planStartDate);
        $("#endTimeEdit").val(resultJson.planEndDate);

        //编辑计划创建时间
        laydate.render({
            elem: '#startTimeEdit'
            ,type: 'datetime'
            ,value:resultJson.planStartDate
        });

        //编辑计划完成时间
        laydate.render({
            elem: '#endTimeEdit'
            ,type: 'datetime'
            ,value:resultJson.planEndDate
        });

    }

    //显示下拉框数据
    function huoZhongSelect(result, huoZhongSelect,value) {
        if (result.SUCCESS) {
            var data = result.data;
            var obj = document.getElementById('editHuoZhong');
            obj.options.length = 0;
            for (var i in data) {
                huoZhongSelect.append("<option value=" + data[i].goodsId + ">" + data[i].goodsName + "</option>")
            }
        }
        else {
            alert(result.MSG);
        }
        if ('' != value) {
            huoZhongSelect.val(value);
        }
    }

    function setPortSelect(result, portSelect, portSelect1,value,value1) {
        if (result.SUCCESS) {
            var data = result.data;
            var obj = document.getElementById('editOriginalPort');
            obj.options.length = 0;
            var obj1 = document.getElementById('editDestinationPort');
            obj1.options.length = 0;
            for (var i in data) {
                portSelect.append("<option value=" + data[i].logisticsId + ">" + data[i].logisticsName + "</option>")
                portSelect1.append("<option value=" + data[i].logisticsId + ">" + data[i].logisticsName + "</option>")
            }
        }
        else {
            alert(result.MSG);
        }
        if ('' != value) {
            portSelect.val(value);
        }
        if ('' != value1) {
            portSelect1.val(value1);
        }
    }

    function setHuoZhuSelect(result, huoZhuSelect,value) {
        if (result.SUCCESS) {
            var data = result.data;
            var obj = document.getElementById('editHuoZhu');
            obj.options.length = 0;
            for (var i in data) {
                huoZhuSelect.append("<option value=" + data[i].huoZhuId + ">" + data[i].huoZhuName + "</option>")
            }
        }
        else {
            alert(result.MSG);
        }
        if ('' != value) {
            huoZhuSelect.val(value);
        }
    }

    // 修改运输计划
    function editPlanModel() {
        var planId = $("#planId").val();
        var planName = $("#tmsNumberEdit").val();
        var goodsId = $("#editHuoZhong").val();
        var huoZhuId = $("#editHuoZhu").val();
        var original = $("#editOriginalPort").val();
        var destination = $("#editDestinationPort").val();
        var planTonnage = $("#planTonEdit").val();
        var planHead = $("#planEmployEdit").val();
        var planStartDate = $("#startTimeEdit").val();
        var planEndDate = $("#endTimeEdit").val();


        if (!planId || !planName || !goodsId || !huoZhuId || !original || !destination || !planTonnage || !planHead || !planStartDate || !planEndDate) {
            alert("请输入计划信息");
            return;
        }

        if ("2,3,4".indexOf($("#transportStateSpan").text()) > -1) {
            swal({
                title: "该计划处于" + $("#transportStateName").text() + "状态，不能编辑",
                type: "warning"
            });
            return false;
        }

        var data = JSON.stringify({
            "planId": planId,
            "planName": planName,
            "goodsId": goodsId,
            "huoZhuId": huoZhuId,
            "original": original,
            "destination": destination,
            "planTonnage": planTonnage,
            "planHead": planHead,
            "planStartDate": planStartDate,
            "planEndDate": planEndDate
        });
        postAjax('transportPlan/editTransportPlan.do', data, fnAlertEditPlanModel);
    }

    //中止计划
    function deletePlan() {
        if (4 == $("#transportStateSpan").text()) {
            swal({
                title: "您确定要恢复此计划吗？",
                type: "warning",
                showCancelButton: true,
                confirmButtonColor: "#DD6B55",
                confirmButtonText: "立即恢复",
                closeOnConfirm: false
            }, function () {
                var data = JSON.stringify({planId: $("#planId").val()});
                postAjax("transportPlan/restoreTransportPlan.do", data, fnAlertDeletePlan);
            });
        }
        else {
            swal({
                title: "您确定要中止此计划吗？",
                // text: "计划终止后请去已中止计划里恢复！",
                type: "warning",
                showCancelButton: true,
                confirmButtonColor: "#DD6B55",
                confirmButtonText: "立即中止",
                closeOnConfirm: false
            }, function () {
                var data = JSON.stringify({planId: $("#planId").val()});
                postAjax("transportPlan/stopTransportPlan.do", data, fnAlertDeletePlan);
            });
        }

    }

    function fnAlertDeletePlan(result) {
        if (result.SUCCESS) {
            swal({
                title: result.MSG,
                type: "success"
            }, function () {
                location.reload();
            });
        }
        else {
            swal({
                title: result.MSG,
                type: "warning"
            });
        }
    }

    function fnAlertRemovePlanShip(result) {
        if (result.SUCCESS) {
            swal({
                title: "移除计划船舶成功",
                type: "success"
            }, function () {
                location.reload();
            });
        }
        else {
            swal({
                title: result.MSG,
                type: "warning"
            });
        }
    }

    function fnAlertEditTimeOver(result) {
        if (result.SUCCESS) {
            swal({
                title: "航期修改成功",
                type: "success"
            }, function () {
                location.reload();
            });
        }
        else {
            swal({
                title: result.MSG,
                type: "warning"
            });
        }
    }

    function fnAlertEditPlanModel(result) {
        if (result.SUCCESS) {
            swal({
                title: "编辑计划成功",
                type: "success"
            }, function () {
                location.reload();
            });
        }
        else {
            swal({
                title: result.MSG,
                type: "warning"
            });
        }
    }

    //运输计划新增船舶（参考）
    function searchShips(page) {
        if (!page) {
            page = 1;
        }
        var data = JSON.stringify({
            planId: $("#planId").val(),
            page: page,
            shipName: $("#shipNames").val(),
            limit: $('#limit').val()
        });
        $.ajax({
            type: 'post',
            url: 'transportPlan/queryAvShip.do',
            dataType: 'json',
            data: data,
            contentType: "application/json; charset=utf-8",
            success: function (data) {
                if (0 == data.FLAG) {
                    swal({
                        title: "当前搜索的船舶尚未收录，您可以至定制运力池付费添加船舶并长期监测，点击确定按钮进入定制运力池",
                        type: "warning",
                        showCancelButton: true,
                        confirmButtonColor: "#DD6B55",
                        confirmButtonText: "确定",
                        closeOnConfirm: false
                    }, function () {
                        location.href = "toShipHome.do";
                    });
                }
                else if (1 == data.FLAG) {
                    swal({
                        title: data.MSG,
                        type: "warning"
                    });
                }
                else {
                    var array = data.shipList;
                    var str = "";
                    $.each(array, function (i) {
                        var item = array[i];
                        str += "<tr><td>" + item.shipName + "</td><td>" + item.tonnage + "</td><td>" + item.cityName + "</td><td>" + item.phoneNum + "</td><td><input id = 'id_" + item.shipId + "' placeholder='请填写调度人' class='form-control'/></td><td><a class='btn btn-sm btn-info' style='margin-left: 5px' onclick='addShipToPlan(" + item.shipId + ",\"Y\"" + ")' >添加并推送</a></td></tr>"
                    });

                    $("#tbody").html(str);
                    displayFooter(data.pageInfo);
                }
            }
        });
    }

    function displayFooter(pageInfo) {
        var newText = '共' + pageInfo.total + '条记录，' + '当前第' + pageInfo.pageNum + '页，' + '总共' + pageInfo.pages + '页';
        $("#summary").text(newText);
        $("#pagenum").val(pageInfo.pageNum);
        $("#pagesize").val(pageInfo.pages);
    };

    $("#homePage").click(function () {
        var pagenum = 1;
        searchShips(pagenum);
    });

    $("#tailPage").click(function () {
        var pagenum = $("#pagenum").val();
        var pagesize = $("#pagesize").val();
        pagenum = pagesize;
        searchShips(pagenum);
    });

    $("#previousPage").click(function () {
        var pagenum = $("#pagenum").val();
        if (pagenum == 1) {
            return false;
        } else {
            pagenum--;
            searchShips(pagenum);
        }
    });

    $("#nextPage").click(function () {
        var pagenum = $("#pagenum").val();
        var pagesize = $("#pagesize").val();
        if (pagenum == pagesize) {
            return false;
        } else {
            pagenum++;
            searchShips(pagenum);
        }
    });

    //查看全部位置
    function AllFleetPosition() {

        var data = JSON.stringify({planId: $("#planId").val()});
        postAjax("transportPlan/queryPlanShip.do", data, AllFleetPosition1);

    }

    function AllFleetPosition1(result) {
        var map = new AMap.Map('allAMap', {
            resizeEnable: true, //是否监控地图容器尺寸变化
            zoom: 6,//初始化地图层级
            features: ['bg','point']
        });
        var data = result.data;
        for (var i = 0; i < data.length; i++) {
            var item = data[i];
            var marker = new AMap.Marker({
                icon: "http://huizhaochuan.oss-cn-shanghai.aliyuncs.com/hzclogo8.png?x-oss-process=image/resize,p_70",
                position: [item.data.GLon, item.data.GLat]
            });
            //判断地图等级
            map.add(marker);
        }
    }


    $(function () {
        var orderNumberSearch = $("shipNames").val();
        if (orderNumberSearch !=""){
            $("body").keydown(function() {
                if (event.keyCode == "13") {//keyCode=13是回车键
                    $('#searchShipsButton').click();
                }
            });
        }

    });

</script>

</body>

</html>
